<template>
  <el-header style="background-color: lightgray; text-align: right; font-size: 12px;height: 100px;">
    <el-header style="text-align: right; font-size: 12px;height: 100px;">
    <h1 style="font-size: 30px; text-align: left;">窗口收费</h1>
    </el-header>
         <div class="toolbar">
        <div>系统希望您不再是本系统受众，并提醒您务必谨遵医嘱</div>
    
    <div class="sub-title"></div>

           <!-- <span>门诊挂号</span> -->
         </div>
       </el-header>
      
     <h3>患者搜索</h3>
          <el-row>
            <el-col :span="4"><div class="grid-content ep-bg-purple-light" />
      <el-form-item label="病历号：" prop="patientName"  class="label">
     <el-input v-model="form.orderNo" placeholder="请输入病历号"/>
   </el-form-item>
  </el-col>
  <el-col :span="6"><div class="grid-content ep-bg-purple-light" /> 
      <el-form-item label="姓名：" prop="patientName"  class="label">
     <el-input v-model="form.patientName" placeholder="请输入"  />
   </el-form-item>
  </el-col>
  <el-col :span="6">
      <el-button type="primary" @click="search">搜索</el-button>
      <el-button type="primary" @click="storageCheck">暂存</el-button>
    
      <el-button type="danger" @click="resetForm">重置</el-button>
  </el-col>
</el-row>
<h3>患者信息</h3>
  <el-row>
      <el-col :span="4">
      <el-form-item label="姓名：" prop="fangStatus" class="label" >
     <el-input v-model="form.patientName1"   disabled/>   
     </el-form-item>
     </el-col>
      <el-col :span="6">
        <el-form-item label="身份证号：" prop="identityNo" class="label" >
          <el-input v-model="form.identityNo"   disabled/>
        </el-form-item> 
  </el-col>
  <el-col :span="6">
     <el-form-item label="性别：" prop="fangStatus" class="label" >
       <el-input v-model="form.gender" disabled/>
     </el-form-item>
  </el-col>
  <el-col :span="6">
    <el-form-item label="年龄：" prop="age" class="label" >
      <el-input v-model="form.age" placeholder="age" label="年龄" disabled/>   
    </el-form-item>
  </el-col>
  </el-row>
  <el-row>
    <el-col :span="6">
      <el-statistic class="label" title="项目金额￥￥￥"  :value="outputValue" />
    </el-col>
  </el-row>
   <el-tag type="primary" style="margin-left: 30px;">所有项目金额合计为：{{totalPrice}}</el-tag>
  <el-main>
      <el-scrollbar>
        <el-tag type="success">检查项目金额合计为：{{checkPrice}}</el-tag>
        <el-button type="primary" @click="payChecks" style="margin-left: 230px;width:100px;" >检查项目付费</el-button>
        <el-table  ref="multipleTableRef"
    :data="tableData"
    style="width: 100%"
    @selection-change="handleSelectionChange"
    size="mini"  >
    <el-table-column type="selection" width="150" />
    <el-table-column property="techName" label="项目名称" width="200" />
    <el-table-column property="techPrice" label="单价" width="200" />
    <el-table-column property="count" label="数量" width="200" />
    <el-table-column property="createTime" label="开立时间" width="200" />
    <el-table-column label="操作" width="300">
  <template #header >
   
    <el-popconfirm title="你确定?" @confirm="deleteSelectedItems">
    <template #reference>
      <el-button  type="danger"  plain stype="margin:10px" >删除</el-button> 
    </template>
  </el-popconfirm>
     <el-button type="success" @click="saveSelectedItems"  plain stype="margin:10px" >刷新</el-button>
  </template>
  </el-table-column> 
  </el-table>
      </el-scrollbar>
    </el-main>
   

    <!---检验项目合计-->
    <el-main>
      <el-scrollbar>
        <el-tag type="success">检验项目金额合计为：{{inspectionPrice}}</el-tag>
        <el-button type="primary" @click="payInspections" style="margin-left: 230px;width:100px;" >
          检验项目付费</el-button>
        <el-table  ref="multipleTableInspectionRef"
    :data="tableDataInspection"
    style="width: 100%"
    @selection-change="handleSelectionChangeInspection"
    size="mini"  >
    <el-table-column type="selection" width="150" />
    <el-table-column property="techName" label="项目名称" width="200" />
    <el-table-column property="techPrice" label="单价" width="200" />
    <el-table-column property="count" label="数量" width="200" />
    <el-table-column property="createTime" label="开立时间" width="200" />
    <el-table-column label="操作" width="300">
      <template #header > 
       
        <el-popconfirm title="你确定?" @confirm="deleteSelectedItemsInspection">
        <template #reference>
          <el-button  type="danger"  plain stype="margin:10px" >删除</el-button> 
        </template>
      </el-popconfirm>
        <el-button type="success" @click="saveSelectedItemsInspection"  plain stype="margin:10px" >刷新</el-button>
      </template>
    </el-table-column>
    </el-table>
      </el-scrollbar>
    </el-main>
    <!---处置项目合计-->
    <el-main> 
      <el-scrollbar>
        <el-tag type="success">处置项目金额合计为：{{disposalPrice}}</el-tag>
        <el-button type="primary" @click="payDisposals" style="margin-left: 230px;width:100px;" >处置项目付费</el-button>
        <el-table  ref="multipleTableDisposalRef"
    :data="tableDataDisposal"
    style="width: 100%"
    @selection-change="handleSelectionChangeDisposal"
    size="mini"  >
    <el-table-column type="selection" width="150" />
    <el-table-column property="techName" label="项目名称" width="200" />
    <el-table-column property="techPrice" label="单价" width="200" />
    <el-table-column property="count" label="数量" width="200" />
    <el-table-column property="createTime" label="开立时间" width="200" />
    <el-table-column label="操作" width="300"> 
      <template #header > 
       
        <el-popconfirm title="你确定?" @confirm="deleteSelectedItemsDisposal">  
          <template #reference>
            <el-button  type="danger"  plain stype="margin:10px" >删除</el-button> 
          </template>
        </el-popconfirm>
        <el-button type="success" @click="saveSelectedItemsDisposal"  plain stype="margin:10px" >刷新</el-button>
        </template>
    </el-table-column>
    </el-table>
      </el-scrollbar>
    </el-main>
    <!---药方项目合计-->
    <el-main> 
      <el-scrollbar>
        <el-tag type="success">药方项目金额合计为：{{prescriptionPrice}}</el-tag>
        <el-button type="primary" @click="payPrescriptions" style="margin-left: 230px;width:100px;" >药方项目付费</el-button>
        <el-table  ref="multipleTablePrescriptionRef"
    :data="tableDataPrescription"
    style="width: 100%"
    @selection-change="handleSelectionChangePrescription"
    size="mini"  > 
    <el-table-column type="selection" width="150" />
    <el-table-column property="techName" label="项目名称" width="200" />
    <el-table-column property="techPrice" label="单价" width="200" />
    <el-table-column property="count" label="数量" width="200" />
    <el-table-column property="createTime" label="开立时间" width="200" />
    <el-table-column label="操作" width="300"> 
      <template #header > 
       
        <el-popconfirm title="你确定?" @confirm="deleteSelectedItemsPrescription">  
          <template #reference>
            <el-button  type="danger"  plain stype="margin:10px" >删除</el-button> 
          </template>
        </el-popconfirm>
        <el-button type="success" @click="saveSelectedItemsPrescription"  plain stype="margin:10px" >刷新</el-button>
        </template>
    </el-table-column>
    </el-table>
      </el-scrollbar>
    </el-main>
   
     <el-main>
      <el-scrollbar>
        <el-tag type="success">挂号项目金额合计为：{{registerPrice}}</el-tag>
        <el-button type="primary" @click="payRegisters" style="margin-left: 230px;width:100px;" >挂号项目付费</el-button>
        <el-table  ref="multipleTableRegisterRef"
    :data="tableDataRegister"
    style="width: 100%"
    @selection-change="handleSelectionChangeRegister"
    size="mini"  >
    <el-table-column type="selection" width="150" />
    <el-table-column property="pName" label="项目名称" width="200" />
    <el-table-column property="dName" label="单价" width="200" />
    <el-table-column property="cStatus" label="数量" width="200" />
    <el-table-column property="oDate" label="开立时间" width="200" />
    <el-table-column label="操作" width="300">
  <template #header >
   
    <el-popconfirm title="你确定?" @confirm="deleteSelectedItemsRegister">
    <template #reference>
      <el-button  type="danger"  plain stype="margin:10px" >删除</el-button> 
    </template>
  </el-popconfirm>
     <el-button type="success" @click="saveSelectedItemsRegister"  plain stype="margin:10px" >刷新</el-button>
  </template>
  </el-table-column> 
</el-table>
      </el-scrollbar>
    </el-main>
    <el-form-item><!--todo:提交全部金额申请按钮-->
        <el-button style="margin-left: 230px;width:100px;"  type="primary" >全部提交</el-button>
        <el-button  style="margin-left: 30px;width:100px;"   @click="goToBookIndex">返回首页</el-button>
    </el-form-item>
 </template>
 
 <script lang="ts" setup name="Pay">
import axiosInstance from '@/utils/axiosUtils';
import { useTransition } from '@vueuse/core'
import { computed, reactive, ref } from 'vue'
import type { TableInstance } from 'element-plus'
import { ElNotification } from 'element-plus'
import router from '@/router';
import { RefSymbol } from '@vue/reactivity';
import { id } from 'element-plus/es/locale';
const multipleTableRef = ref<TableInstance>()
const multipleSelection = ref<User[]>([])
//数据表引用类型
interface User {
   id:number,
   techName: string,
   deptId:number,
   techPrice:number,
   priceType: string,
   techType: string,
}
//挂号项目引用类型
interface RegisterUser {
   id:number,
   techName: string,
   deptId:number,
   techPrice:number,
   priceType: string,
   techType: string,
}
//检验项目引用类型
interface InspectionUser {
   id:number,
   techName: string,
   deptId:number,
   techPrice:number,
   priceType: string,
   techType: string,
}
//处置项目引用类型
interface DisposalUser {
   id:number,
   techName: string,
   deptId:number,
   techPrice:number,
   priceType: string,
   techType: string,
} 
//药方项目引用类型
interface PrescriptionUser {
   id:number,
   techName: string,
   deptId:number,
   techPrice:number,
   priceType: string,
   techType: string,
} 
//患者个人信息
const patientInfo = ref({
  registerId:0

});
//挂号项目总价
let registerPrice=ref(0);
//检验项目总价
let inspectionPrice=ref(0);
//处置项目总价
let disposalPrice=ref(0);
//药方项目总价
let prescriptionPrice=ref(0);
//挂号项目选中项
const multipleSelectionRegister = ref<RegisterUser[]>([])
//检验项目选中项
const multipleSelectionInspection = ref<InspectionUser[]>([])
//处置项目选中项
const multipleSelectionDisposal = ref<DisposalUser[]>([])
//药方项目选中项
const multipleSelectionPrescription = ref<PrescriptionUser[]>([])
//检查数据初始值
const tableData=ref( [
  {
     id:null,
     techName: null,
     techPrice: null,
     priceType:null,
     techType: null,
     createTime:null,
     count:null
  }
])
//检验数据初始值
const tableDataInspection=ref( [
  {
    id:null,
     techName: null,
     techPrice: null,
     priceType:null,
     techType: null,
     createTime:null,
     count:null
  }
])
//处置数据初始值
const tableDataDisposal=ref( [
  {
    id:null,
     techName: null,
     techPrice: null,
     priceType:null,
     techType: null,
     createTime:null,
     count:null
  }
])
//药方数据初始值
const tableDataPrescription=ref( [
  {
    id:null,
     techName: null,
     techPrice: null,
     priceType:null,
     techType: null,
     createTime:null,
     count:null
  }
])
//挂号数据初始值
const tableDataRegister=ref( [
  {
    id:null,
     techName: null,
     techPrice: null,
     priceType:null,
     techType: null,
     createTime:null,
     count:null
  }
])
//暂存检查项目
const storageCheck=()=>{
  sessionStorage.setItem('PatientCheck',JSON.stringify(form))
  sessionStorage.setItem('SelectedChecks',JSON.stringify(multipleSelection.value))
}
const realName=ref('');
const orderNo=ref('');
//检查总价确认
let checkPrice=ref(0);
//表单
const patientCheckData = JSON.parse(sessionStorage.getItem('PatientCheck')) || {};

const form = reactive({
  registerId: patientCheckData.registerId || null,
  orderNo: patientCheckData.orderNo || null,
  patientName: patientCheckData.patientName || null,
  identityNo: patientCheckData.identityNo || null,
  gender: patientCheckData.gender || null,
  age: patientCheckData.age || null,
  checkStatus: 1,
  patientName1: patientCheckData.patientName || null,
});


//检查项目付费
const payChecks = () => {
  if(multipleSelection.value.length==0){
    
    ElNotification({
      title: '提示',
      message: '请选择检查项目',
      type: 'warning'
    })
     }if(form==null){
    ElNotification({
      title: '提示',
      message: '请先选择患者信息',
      type: 'warning'
    })
  }
  if(multipleSelection.value.length>0 && form!=null){
    router.push({name:'payMoney',
    query:{
      type:'check',
      selectedRequests:JSON.stringify(multipleSelection.value),
      registerId:form.registerId,
      realName:form.patientName1,
      requestsPrice:checkPrice.value
    }})

  }

}
//挂号项目付费
const payRegisters = () => {
if(multipleSelectionRegister.value.length==0){
    ElNotification({
      title: '提示',
      message: '请选择挂号项目',
      type: 'warning'
    }) 
  }if(form==null){
    ElNotification({
      title: '提示',
      message: '请先选择患者信息',
      type: 'warning'
    })
  }
  if(multipleSelectionRegister.value.length>0 && form!=null){
    router.push({name:'payMoney',
    query:{
      type:'register',
      selectedRegisters:JSON.stringify(multipleSelectionRegister.value),
      registerId:form.registerId,
      realName:form.patientName1,
      checksPrice:registerPrice.value
    }})
  }
 
}
//检验项目付费
const payInspections = () => {
 if(multipleSelectionInspection.value.length==0){
    ElNotification({
      title: '提示',
      message: '请选择检验项目',  
 type: 'warning'})
 }
 if(form==null){
    ElNotification({
      title: '提示',
      message: '请先选择患者信息',
      type: 'warning'
    })
 }
 if(multipleSelectionInspection.value.length>0 && form!=null){
  router.push({name:'payMoney',query:{
    type:'inspection',
    selectedRequests:JSON.stringify(multipleSelectionInspection.value),
    registerId:form.registerId,
      realName:form.patientName1,
      requestsPrice:inspectionPrice.value
  }})
 }

}
//处置项目付费
const payDisposals = () => {
 if(multipleSelectionDisposal.value.length==0){
    ElNotification({
      title: '提示',
      message: '请选择处置项目',
      type: 'warning'
      })
 
 }if(form==null){
    ElNotification({
      title: '提示',
      message: '请先选择患者信息',
      type: 'warning'
    })
 }if(multipleSelectionDisposal.value.length>0 && form!=null){
  router.push({name:'payMoney',query:{
    type:'disposal',
    selectedRequests:JSON.stringify(multipleSelectionDisposal.value),
    registerId:form.registerId,
      realName:form.patientName1,
      requestsPrice:disposalPrice.value
  }})
 }  
}
//药方项目付费
const payPrescriptions = () => {
  // 发送请求
  axiosInstance.post('/api/prescription/payPrescriptions', {
    prescriptionItems: multipleSelectionPrescription.value,
    prescriptionPrice: prescriptionPrice.value
  })
}
// 搜索患者个人信息
const search = () => {
  // 确保去除输入值的空格
  const orderNo = form.orderNo ? form.orderNo.trim() : null;
  const realName = form.patientName ? form.patientName.trim() : null;

  // 确保至少提供一个查询参数
  if (!orderNo && !realName) {
    console.error('请提供病历号或真实姓名进行查询');
    return; // 不进行请求
  }

  // 发送请求
  axiosInstance.get('/api/register/selectOrderPatient', {
    params: {
      orderNo: orderNo,
      realName: realName
    }
  })
  .then(response => {
    console.log('响应数据:', response.data);

  //检查数据是否不为空
    if (response.data ) {
      if(!form.orderNo){
        form.orderNo=response.data.caseNumber;
      }else if(!form.patientName){
        form.patientName=response.data.realName;
      }
      form.gender = response.data.gender;
      form.age = response.data.age;
      form.identityNo=response.data.cardNumber;
      form.patientName1=response.data.realName;
      patientInfo.value.registerId=response.data.id;
      form.registerId=response.data.id;
        searchChecksNotPay();
        searchInspectionsNotPay();
        searchDisposalsNotPay();
      //  searchPrescriptionsNotPay();
      //  searchRegistersNotPay();
    } else {
      console.warn('未找到匹配的病人信息');
    }
  })
  .catch(error => {
    console.error('查询出现错误:', error);
  });

};
//搜索患者未付款的检查项目
const searchChecksNotPay=()=>{
  // 确保 registerId 已设置
  if (!patientInfo.value.registerId) {
    console.warn('未找到注册ID，无法查询未付款检查项目');
    return;
  }
  axiosInstance.get('/api/checkRequest/selectChecksNotPay',{
    params:{
      registerId:patientInfo.value.registerId
    }
  }).then(response => {
    console.log('响应数据:', response.data);
    response.data.forEach(item => {
      tableData.value.push({
       id:item.id,
       techName:item.techName,
       techPrice:item.techPrice,
       priceType:item.priceType,
       techType:item.techType,
       createTime:item.createTime,
       count:1
       })
    });
 
  })
  .catch(error => {
    console.error('查询出现错误:', error);
  });
}
//搜索患者未付款的检验项目
const searchInspectionsNotPay=()=>{
  // 确保 registerId 已设置
  if (!patientInfo.value.registerId) {
    console.warn('未找到注册ID，无法查询未付款检查项目');
    return;
  }
  axiosInstance.get('/api/inspectionRequest/selectInspectionsNotPay',{
    params:{
      registerId:patientInfo.value.registerId
    }
  }).then(response => {
    console.log('响应数据:', response.data);
    response.data.forEach(item => {
      tableDataInspection.value.push({
       id:item.id,
       techName:item.techName,
       techPrice:item.techPrice,
       priceType:item.priceType,
       techType:item.techType,
       createTime:item.createTime,
       count:1
       })
    });
 
  })
  .catch(error => {
    console.error('查询出现错误:', error);
  });
}
//搜索患者未付款的处置项目
const searchDisposalsNotPay=()=>{
  // 确保 registerId 已设置
  if (!patientInfo.value.registerId) {
    console.warn('未找到注册ID，无法查询未付款检查项目');
    return;
  }
  axiosInstance.get('/api/disposalRequest/selectDisposalsNotPay',{
    params:{
      registerId:patientInfo.value.registerId
    }
  }).then(response => {
    console.log('响应数据:', response.data);
    response.data.forEach(item => {
      tableDataDisposal.value.push({
       id:item.id,
       techName:item.techName,
       techPrice:item.techPrice,
       priceType:item.priceType,
       techType:item.techType,
       createTime:item.createTime,
       count:1
       })
    });
 
  })
  .catch(error => {
    console.error('查询出现错误:', error);
  });
}
//搜索患者未付款的药方项目
const searchPrescriptionsNotPay=()=>{
  // 确保 registerId 已设置
  if (!patientInfo.value.registerId) {
    console.warn('未找到注册ID，无法查询未付款检查项目');
    return;
  }
  axiosInstance.get('/api/prescriptionRequest/selectPrescriptionsNotPay',{
    params:{
      registerId:patientInfo.value.registerId
    }
  }).then(response => {
    console.log('响应数据:', response.data);
    response.data.forEach(item => {
      tableDataPrescription.value.push({
       id:item.id,
       techName:item.techName,
       techPrice:item.techPrice,
       priceType:item.priceType,
       techType:item.techType,
       createTime:item.createTime,
       count:1
       })
    });
 
  })
  .catch(error => {
    console.error('查询出现错误:', error);
  });
}
//搜索患者未付款的挂号项目
const searchRegistersNotPay=()=>{
  // 确保 registerId 已设置
  if (!patientInfo.value.registerId) {
    console.warn('未找到注册ID，无法查询未付款检查项目');
    return;
  }
  axiosInstance.get('/api/register/selectRegistersNotPay',{
    params:{
      registerId:patientInfo.value.registerId
    }
  }).then(response => {
    console.log('响应数据:', response.data);
    response.data.forEach(item => {
      tableDataRegister.value.push({
       id:item.id,
       techName:item.techName,
       techPrice:item.techPrice,
       priceType:item.priceType,
       techType:item.techType,
       createTime:item.createTime,
       count:1
       })
    });
 
  })
  .catch(error => {
    console.error('查询出现错误:', error);
  });
}
//对话框引用
const dialog = ref(false)
//处理检查项目选中项
const handleSelectionChange = (val: User[]) => {
  calculateCheckPrice(val);
  multipleSelection.value = val;
  console.log("被选中项：",multipleSelection.value);
};
//计算检查项目总金额
const calculateCheckPrice = (selectedItems) => {
 const total= checkPrice.value = selectedItems.reduce((total, item) => {
    return total + (Number(item.techPrice) || 0); // 累加单价
  }, 0);
  checkPrice.value = total.toFixed(2); // 保留两位小数并赋值
};
//刷新检查项目选中项
const saveSelectedItems = () => {
  //使其重新加载数据
  handleSelectionChange(multipleSelection.value);
  // 在这里实现保存逻辑，根据业务需求处理选中的项目
  console.log('已选中项：', multipleSelection.value); // 打印选中的项目
  // 可以将选中的项目保存到某个状态或发起 API 请求
  ElNotification({
    title: '成功',
    message: '已选中' + multipleSelection.value.length + '项',
    type:'success',
    duration: 2000
  }); // 显示成功提示
};
//删除检查项目选中项========》遍历每个项的id，被选中的项的id不等于tabledata中的id，则删除
const deleteSelectedItems = () => {
   if(multipleSelection.value.length === 0){
    ElNotification({
      title: '警告',
      message: '请先选择要删除的项',
      type: 'warning',
      duration: 2000
    })
   
   }else{
  console.log('已选中项：', multipleSelection.value); // 打印选中的项目
   // 从 tableData 中移除选中的项
   multipleSelection.value.forEach(selectedItem => {
      tableData.value = tableData.value.filter(item => item.id !== selectedItem.id);
  });
     // 清空选中项
    multipleSelection.value = [];
    multipleTableRef.value?.clearSelection();
  ElNotification({
    title: '成功',
    message: '已删除',
    type:'success',
    duration: 2000
  }); // 显示成功提示
}
}
//挂号项目付费
//对话框引用
const dialogRegister = ref(false)
//处理挂号项目选中项
const handleSelectionChangeRegister = (val: RegisterUser[]) => {
  calculateRegisterPrice(val);
  multipleSelectionRegister.value = val;
  console.log("被选中项：",multipleSelectionRegister.value);
};
//计算挂号项目总金额
const calculateRegisterPrice = (selectedItems) => {
 
 const total= registerPrice.value = selectedItems.reduce((total, item) => {
    return total + (Number(item.techPrice) || 0); // 累加单价
  }, 0);
  // registerPrice.value = registerPrice.value.toFixed(2); // 保留两位小数并赋值
};
//刷新挂号项目选中项
const saveSelectedItemsRegister = () => {
  //使其重新加载数据
  handleSelectionChangeRegister(multipleSelectionRegister.value);
  // 在这里实现保存逻辑，根据业务需求处理选中的项目
  console.log('已选中项：', multipleSelectionRegister.value); // 打印选中的项目
  // 可以将选中的项目保存到某个状态或发起 API 请求
  ElNotification({
    title: '成功',
    message: '已选中' + multipleSelectionRegister.value.length + '项',
    type:'success',
    duration: 2000
  }); // 显示成功提示
};
//删除挂号项目选中项========》遍历每个项的id，被选中的项的id不等于tabledata中的id，则删除
const deleteSelectedItemsRegister = () => {
   if(multipleSelectionRegister.value.length === 0){
    ElNotification({
      title: '警告',
      message: '请先选择要删除的项',
      type: 'warning',
      duration: 2000
    })
   
   }else{
  console.log('已选中项：', multipleSelectionRegister.value); // 打印选中的项目
   // 从 tableData 中移除选中的项
   multipleSelectionRegister.value.forEach(selectedItem => {
      tableDataRegister.value = tableDataRegister.value.filter(item => item.id !== selectedItem.id);
  });
     // 清空选中项
    multipleSelectionRegister.value = [];
    multipleTableRef.value?.clearSelection();
  ElNotification({
    title: '成功',
    message: '已删除',
    type:'success',
    duration: 2000
  }); // 显示成功提示
}
}
//检验项目付费
//对话框引用
const dialogInspection = ref(false)
//处理检验项目选中项
const handleSelectionChangeInspection = (val: InspectionUser[]) => {
  calculateInspectionPrice(val);
  multipleSelectionInspection.value = val;
  console.log("被选中项：",multipleSelectionInspection.value);
};
//计算检验项目总金额
// 计算检验项目总金额
const calculateInspectionPrice = (selectedItems) => {
  const total = selectedItems.reduce((total, item) => {
    return total + (Number(item.techPrice) || 0); // 累加单价
  }, 0); // 计算总金额

  inspectionPrice.value = total.toFixed(2); // 保留两位小数并赋值
};

//刷新检验项目选中项
const saveSelectedItemsInspection = () => {
  //使其重新加载数据
  handleSelectionChangeInspection(multipleSelectionInspection.value);
  // 在这里实现保存逻辑，根据业务需求处理选中的项目
  console.log('已选中项：', multipleSelectionInspection.value); // 打印选中的项目
  // 可以将选中的项目保存到某个状态或发起 API 请求
  ElNotification({
    title: '成功',
    message: '已选中' + multipleSelectionInspection.value.length + '项',
    type:'success',
    duration: 2000
  }); // 显示成功提示
};
//删除检验项目选中项========》遍历每个项的id，被选中的项的id不等于tabledata中的id，则删除
const deleteSelectedItemsInspection = () => {
   if(multipleSelectionInspection.value.length === 0){
    ElNotification({
      title: '警告',
      message: '请先选择要删除的项',
      type: 'warning',
      duration: 2000
    })
   
   }else{
  console.log('已选中项：', multipleSelectionInspection.value); // 打印选中的项目
   // 从 tableData 中移除选中的项
   multipleSelectionInspection.value.forEach(selectedItem => {
      tableDataInspection.value = tableDataInspection.value.filter(item => item.id !== selectedItem.id);
  });
     // 清空选中项
    multipleSelectionInspection.value = [];
    multipleTableRef.value?.clearSelection();
  ElNotification({
    title: '成功',
    message: '已删除',
    type:'success',
    duration: 2000
  }); // 显示成功提示
}
}
//处置项目付费
//对话框引用
const dialogDisposal = ref(false)
//处理处置项目选中项
const handleSelectionChangeDisposal = (val: DisposalUser[]) => {
  calculateDisposalPrice(val);
  multipleSelectionDisposal.value = val;
  console.log("被选中项：",multipleSelectionDisposal.value);
};
//计算处置项目总金额
// 计算处置项目总金额
const calculateDisposalPrice = (selectedItems) => {
  const total = selectedItems.reduce((total, item) => {
    return total + (Number(item.techPrice) || 0); // 累加单价
  }, 0);
  disposalPrice.value = total.toFixed(2); // 保留两位小数并赋值
};

//刷新处置项目选中项
const saveSelectedItemsDisposal = () => {
  //使其重新加载数据
  handleSelectionChangeDisposal(multipleSelectionDisposal.value);
  // 在这里实现保存逻辑，根据业务需求处理选中的项目
  console.log('已选中项：', multipleSelectionDisposal.value); // 打印选中的项目
  // 可以将选中的项目保存到某个状态或发起 API 请求
  ElNotification({
    title: '成功',
    message: '已选中' + multipleSelectionDisposal.value.length + '项',
    type:'success',
    duration: 2000
  }); // 显示成功提示
};
//删除处置项目选中项========》遍历每个项的id，被选中的项的id不等于tabledata中的id，则删除
const deleteSelectedItemsDisposal = () => {
   if(multipleSelectionDisposal.value.length === 0){
    ElNotification({
      title: '警告',
      message: '请先选择要删除的项',
      type: 'warning',
      duration: 2000
    })
   
   }else{
  console.log('已选中项：', multipleSelectionDisposal.value); // 打印选中的项目
   // 从 tableData 中移除选中的项
   multipleSelectionDisposal.value.forEach(selectedItem => {
      tableDataDisposal.value = tableDataDisposal.value.filter(item => item.id !== selectedItem.id);
  });     // 清空选中项
    multipleSelectionDisposal.value = [];
    multipleTableRef.value?.clearSelection();
  ElNotification({
    title: '成功',
    message: '已删除',
    type:'success',
    duration: 2000
  }); // 显示成功提示
}
}
//药方项目付费
//对话框引用
const dialogPrescription = ref(false)
//处理药方项目选中项
const handleSelectionChangePrescription = (val: PrescriptionUser[]) => {
  calculatePrescriptionPrice(val);
  multipleSelectionPrescription.value = val;
  console.log("被选中项：",multipleSelectionPrescription.value);
};
//计算药方项目总金额
const calculatePrescriptionPrice = (selectedItems) => {
  prescriptionPrice.value = selectedItems.reduce((total, item) => {
    return total + (Number(item.techPrice) || 0); // 累加单价
  }, 0);
};
//刷新药方项目选中项
const saveSelectedItemsPrescription = () => {
  //使其重新加载数据
  handleSelectionChangePrescription(multipleSelectionPrescription.value);
  // 在这里实现保存逻辑，根据业务需求处理选中的项目
  console.log('已选中项：', multipleSelectionPrescription.value); // 打印选中的项目
  // 可以将选中的项目保存到某个状态或发起 API 请求
  ElNotification({
    title: '成功',
    message: '已选中' + multipleSelectionPrescription.value.length + '项',
    type:'success',
    duration: 2000
  }); // 显示成功提示
};
//删除药方项目选中项========》遍历每个项的id，被选中的项的id不等于tabledata中的id，则删除
const deleteSelectedItemsPrescription = () => {
   if(multipleSelectionPrescription.value.length === 0){
    ElNotification({
      title: '警告',
      message: '请先选择要删除的项',
      type: 'warning',
      duration: 2000
    })
   
   }else{
  console.log('已选中项：', multipleSelectionPrescription.value); // 打印选中的项目
   // 从 tableData 中移除选中的项
   multipleSelectionPrescription.value.forEach(selectedItem => {
      tableDataPrescription.value = tableDataPrescription.value.filter(item => item.id !== selectedItem.id);
  });
     // 清空选中项
    multipleSelectionPrescription.value = [];
    multipleTableRef.value?.clearSelection();
  ElNotification({
    title: '成功',
    message: '已删除',
    type:'success',
    duration: 2000
  }); // 显示成功提示
}
}
 
const source = ref(0)
const outputValue = useTransition(source, {
  duration: 1500,
})
source.value = 172000
//清空表单函数
const resetForm=()=>{
for(const key in form){
  form[key]='';
}
};
//所有项目的金额
const totalPrice = computed(() => {
  return (Number(checkPrice.value) || 0)
      + (Number(registerPrice.value) || 0) + 
      (Number(inspectionPrice.value) || 0) + 
      (Number(disposalPrice.value) || 0) + 
      (Number(prescriptionPrice.value) || 0);
});

 //返回首页
const goToBookIndex = () => {
  router.push({ name: 'bookIndex' })
}


</script>
<style lang="css" link-ref="main.css"/>
<style scoped> 
h1{
  padding-left: 30px;
  
}
.label{
width: 200px;
 color: grey;
padding-left: 30px;

}
 
h3{
padding-left: 20px;
}
.demo-basic {
text-align: right;
}
.demo-basic .sub-title {
margin-bottom: 10px;
font-size: 14px;
color: var(--el-text-color-secondary);
}
.demo-basic .demo-basic--circle,
.demo-basic .demo-basic--square {
display: flex;
justify-content: flex-end;
align-items: right;
}
.demo-basic .block:not(:last-child) {
border-right: 1px solid var(--el-border-color);
}
.demo-basic .block {
flex: 1;
}
.demo-basic .el-col:not(:last-child) {
border-right: 1px solid var(--el-border-color);
}


</style>